'use strict';

const path = require('path');
const defaultSettings = require('./site.config');
const BundleAnalyzerPlugin = require('webpack-bundle-analyzer').BundleAnalyzerPlugin;
const CompressionWebpackPlugin = require('compression-webpack-plugin');
const port = process.env.port || process.env.npm_config_port || 9528; // dev port
const isDev = process.env.NODE_ENV === 'development';
// 代理域名以及是否是内网部署
const { proxyHttp, isIntranet } = defaultSettings;
const title = defaultSettings.title || '杭州徽华信息技术公司'; // page title
const resolve = dir => path.join(__dirname, dir);
const assetsCDN = {
  externals: {
    vue: 'Vue',
    'vue-router': 'VueRouter',
    vuex: 'Vuex',
    axios: 'axios',
  },
  css: [],
  js: [
    '//cdn.jsdelivr.net/npm/vue@2.6.12/dist/vue.min.js',
    '//cdn.jsdelivr.net/npm/vue-router@3.1.3/dist/vue-router.min.js',
    '//cdn.jsdelivr.net/npm/vuex@3.1.1/dist/vuex.min.js',
    '//cdn.jsdelivr.net/npm/axios@0.19.0/dist/axios.min.js',
  ],
};

module.exports = {
  publicPath: '/',
  outputDir: 'demo',
  assetsDir: 'static',
  lintOnSave: isDev,
  productionSourceMap: false,
  devServer: {
    hot: true,
    port: port,
    open: true,
    overlay: {
      warnings: false,
      errors: true,
    },
    proxy: {
      '/api': {
        target: proxyHttp, // 后台接口
        ws: false, // 如果要代理websockets
        changeOrigin: true, // 将选项changeOrigin设置true为基于名称的虚拟托管站点。
      },
      '/admin': {
        target: proxyHttp, // 后台接口
        ws: false, // 如果要代理websockets
        changeOrigin: true, // 将选项changeOrigin设置true为基于名称的虚拟托管站点。
      },
    },
  },

  configureWebpack: config => {
    // provide the app's title in webpack's name field, so that
    // it can be accessed in index.html to inject the correct title.
    config['name'] = title;
    config['externals'] = !isDev && !isIntranet ? assetsCDN.externals : {};
    const plugins = [];
    if (!isDev) {
      // 代码压缩 以及
      plugins.push(
        new CompressionWebpackPlugin({
          filename: '[path].gz[query]',
          algorithm: 'gzip',
          test: new RegExp('\\.(js|css)$'),
          threshold: 10240,
          minRatio: 0.8,
        }),
        new BundleAnalyzerPlugin()
      );
    }
    config.plugins = [...config.plugins, ...plugins];
  },
  chainWebpack(config) {
    if (!isDev && !isIntranet) {
      config.plugin('html').tap(args => {
        args[0].cdn = assetsCDN;
        return args;
      });
    }
    config.resolve.alias
      .set('@', resolve('src'))
      .set('@api', resolve('src/api'))
      .set('@views', resolve('src/views'))
      .set('@utils', resolve('src/utils'))
      .set('@assets', resolve('src/assets'))
      .set('@router', resolve('src/router'))
      .set('@components', resolve('src/components'));
    config.module
      .rule('gltf')
      .test(/\.gltf$/)
      .include.add(resolve('src/assets/model'))
      .end()
      .use('url-loader')
      .loader('url-loader')
      .options({
        limit: 200000,
      })
      .end();
  },
  css: {
    loaderOptions: {
      sass: {
        // prependData: '@import "~@/assets/styles/index.scss";',
      },
    },
  },
};
